<template>
  <view>
    <view
      style="width: 100%;height: 280px;backgroud:url('http://xl-cover.kongetech.cn/3da2b02216eb200bc7e8ac93a9de689.png')">
      <l-signature disable-scroll ref="signatureRef"></l-signature>
    </view>
    <view class="btn-container">
      <button type="primary" @click="onClick('clear')">清空</button>
      <button type="primary" @click="onClick('undo')">撤消</button>
      <button type="primary" @click="onClick('save')">保存</button>
    </view>
  </view>

</template>

<script>
  export default {
    data() {
      return {

      };
    },
    methods: {
      onClick(type) {
        if (type == 'save') {
          this.$refs.signatureRef.canvasToTempFilePath({
            success: (res) => {
              this.url = res.tempFilePath
              console.log(this.url)
              uni.$emit('signature', res.tempFilePath)
              //uni.navigateBack()
            }
          })
          return
        }
        if (this.$refs.signatureRef)
          this.$refs.signatureRef[type]()
      }
    }
  }
</script>

<style lang="scss" scoped>
  .btn-container {
    margin-top: 20rpx;
    height: 40px;
    display: flex;
    justify-content: space-around;

    button {
      height: 30px;
      line-height: 30px;
      font-size: 16px;
    }
  }
</style>